<template>
  <div class="h-full overflow-hidden border-box">
    <EvTable
      ref="EvTableRef"
      :ev-table-options="{}"
      :get-table-data-params="listQuery"
      :get-table-data-fn="getList"
      has-pager
    >
      <template #searchSlot>
        <n-form inline :show-feedback="false" label-placement="left">
          <n-space wrap>
            <n-form-item label="账号名称">
              <n-input placeholder="请输入账号名称"></n-input>
            </n-form-item>
            <n-form-item label="用户名">
              <n-input placeholder="请输入用户名"></n-input>
            </n-form-item>
            <n-form-item label="电话">
              <n-input placeholder="请输入电话"></n-input>
            </n-form-item>
            <n-button type="primary" class="float-right">搜索</n-button>
          </n-space>
        </n-form>
      </template>
      <template #buttonsSlot>
        <n-button>新增</n-button>
      </template>
      <template #tableSlot>
        <vxe-column field="name" min-width="200" title="账号名称"></vxe-column>
        <vxe-column field="username" min-width="200" title="用户名"></vxe-column>
        <vxe-column field="phone" width="200" title="电话"></vxe-column>
        <vxe-column field="email" width="200" title="电子邮箱"></vxe-column>
        <vxe-column field="dictOnOff" width="100" title="状态"> </vxe-column>
        <vxe-column :show-overflow="false" fixed="right" title="操作" width="100px">
          <template #default="{ row }">
            <n-space justify="start">
              <n-button type="warning">查看</n-button>
            </n-space>
          </template>
        </vxe-column>
      </template>
    </EvTable>
  </div>
</template>

<script setup>
import { ref } from 'vue';
const listQuery = ref({});
function getList() {
  return new Promise((resolve) => {
    resolve({ data: [], total: 0 });
  });
}
</script>

<style scoped></style>
